<template>
  <div class="home">
    <NavBarVue>
      <template v-slot:left>
        <van-icon name="add-o" size="18" @click="go_release()" />
      </template>
      <template v-slot:title>
        <van-tabs v-model="active" swipeable @change="change">
          <van-tab replace to="/home/focus" title="关注" name="a"></van-tab>
          <van-tab replace to="/home/found" title="发现" name="b"></van-tab>
        </van-tabs>
      </template>
      <template v-slot:right>
        <van-icon name="search" size="18" @click="itemClick()" />
      </template>
    </NavBarVue>
    <router-view />
  </div>
</template>

<script>
// @ is an alias to /src
import NavBarVue from "../../components/NavBar.vue";
export default {
  name: "Home",
  components: {
    NavBarVue,
  },
  data() {
    return {
      active: "b",
    };
  },
  methods: {
    change(name) {
      this.active = name;
      console.log(this.active);
    },
    itemClick() {
      this.$router.push("/home/search");
    },
    go_release() {
      this.$router.push("/home/release");
    },
  },
};
</script>
